<template>
	<view>
		<indexpage :showitem="showitem" v-show="islogin"></indexpage>
		<view v-show="!islogin" class="notlogin" @click="log">您还没有登录~</view>
	</view>
</template>

<script>
	import indexpage from "@/component/indexpage/indexpage.vue"
		import myrequest from "@/untils/request.js"
	export default {
		components:{
			indexpage
		},
		data() {
			return {
				title: 'Hello',
				pageSize:5,
				pageNum:1,
				pages:[],
				showitem:{
					  bigview:[],
					  subItem:[],
					  zhuanjing:[]
				},
				isend:false
			}
		},
		computed:{
			islogin(){
				return this.$store.state.isLogin
			}
		},
		methods: {
			log(){
				console.log(this.pages);
				console.log(this.$store.state);
				console.log(this.islogin);
			},
			separateList(){
				for(var i in this.pages){
					if(i<1){
						this.showitem.bigview.push(this.pages[i])
					}else if(i<3){
						this.showitem.subItem.push(this.pages[i])
					}else{
						this.showitem.zhuanjing.push(this.pages[i])
					}
				}
				console.log(this.showitem);
			},
			reachDown(){
				if(!this.isend){
						this.pageNum++
					myrequest.getpage(this.$store.state.token,this.pageNum,this.pageSize)
					.then(r=>{
						if(r.data.data.items.length){
							for(var i in r.data.data.items){
								if(r.data.data.items[i].status === 2){
									this.showitem.zhuanjing.push(r.data.data.items[i])
								}
							}
						}else{  //没有了
							this.isend =true
						}
						
					})
				}else{
					uni.showToast({
						title:"已经到底了！！",
						icon:"error"
					})
				}
				
			},
			refresh(){
				this.showitem.bigview.length = 0,
			    this.showitem.subItem.length = 0
				this.showitem.zhuanjing.length = 0
				this.pageNum=1
				this.isend = false
				this.getdata()
			},
			getdata(){
				myrequest.getpage(this.$store.state.token,this.pageNum,this.pageSize)
				.then(r=>{
					// console.log("哦哦哦哦哦哦哦哦哦哦哦哦噢噢噢噢");
					// console.log(r);
					this.pages = r.data.data.items
				}).then(()=>{
					this.separateList()
					uni.$emit("indexok")
					uni.stopPullDownRefresh()
				})
			}
		},
		onLoad() {
			uni.$on("loginok",this.refresh)
		},
		onPullDownRefresh() {
			this.refresh()
			console.log("首页已经在刷新");
		},
		onReachBottom() {
			console.log("首页已经触底了");
			this.reachDown()
		},
		onUnload() {
			uni.$off("loginok")
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	
	.notlogin{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100vw;
		height: 100vh;
		font-size: 30px;
	}
</style>
